<template>
  <div class="auto-archive-container">
    <div class="order-archive-header">
      <router-link to="/Home/OrderArchives/AutoOrderArchives">
        <div>用车工单</div>
      </router-link>
      <router-link to="/Home/OrderArchives/RepairOrderArchives">
        <div>维修工单</div>
      </router-link>
    </div>

    <div class="order-archive-body">
      <router-view></router-view>
    </div>
  </div>
</template>

<script>
export default {
  name: "OrderArchives",
  data() {
    return {

    }
  },

  methods: {

  },
  mounted() {

  }

}

</script>

<style scoped>
.auto-archive-container {
  height: 100%;
  width: 95%;
  margin: 0 auto;
  margin-top: 1%;
  background-color: #fff;
}

.order-archive-header {
  display: flex;
  width: 90%;
  margin: 0 auto;
  border-bottom: 2px solid #ebeef5;
}

.order-archive-header div {
  height: 50px;
  line-height: 50px;
  padding: 0 10px;
  /* border-bottom: burlywood 1px solid; */
}

.order-archive-header a {
  &.router-link-active {
    /* border-bottom: 4px #409eff solid; */
    /* background-color: #409eff; */
    color: #409eff;
  }
}

.order-archive-body {
  width: 100%;
  height: 40%;
  margin: 10px auto;
}
</style>